<template>
  <div id="app">
    <el-container style=" background-color: rgb(242, 245, 245);">
      <el-header>
        <el-card class="box-card" style="height:60px">
          <el-row class="tac" style="margin-left:-10px;margin-right:-10px;margin-top:-22px;">
            <el-col :span="2" :gutter="25">
              <img src="../static/images/index1.png" style="height:59px;"/>
            </el-col>
            <el-col :span="4" style="margin-top:-6px">
              <h2>网络工具知识平台</h2>
            </el-col>
            <el-col :span="14" style="margin-top:2px">
              <el-menu :default-active="activeMenuIndex" class="el-menu-demo" mode="horizontal" @select="selectMenu">
                <el-menu-item index="1">文档</el-menu-item>
                <el-menu-item index="2">帮助</el-menu-item>
              </el-menu>
            </el-col>
            <el-col :span="4" style="margin-top: 12px;">
              <el-input
                placeholder="请输入内容"
                prefix-icon="el-icon-search"
                v-model="searchKey">
              </el-input>
            </el-col>
          </el-row>
        </el-card>
      </el-header>
      <el-main style="padding-top:10px;padding-bottom:20px;overflow-x:hidden;">
        <router-view></router-view>
      </el-main>
    </el-container>
  </div>
</template>

<script>
export default {
  created() {
      this.getConfigJson();
      //初始化需求树
      this.$router.push({ name: 'documents'});
  },
  data(){
    return {
      activeMenuIndex:'1',
      searchKey:''
    }
  },
  methods: {
    selectMenu(value, data) {
      if(value == '1'){
        this.$router.push({ name: 'documents'});
      }
      // 如果选择的是帮助，跳转到帮助页面
      else if(value == '2'){
        console.log(value);
        this.$router.push({ 
          name: 'help',
          params: {
            classifyIndex: 'help',
            docIndex: 'help',
            docName: '帮助'
          }
        });
      }
    }
  }
}
</script>

<style>
#app {
	font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;
	font-weight: 400;
}
.el-header{
	padding:0px;
}

.el-main{
	padding:0px;
}
body{
	margin:0px;
	overflow-y:hidden;
	font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","\5FAE\8F6F\96C5\9ED1",Arial,sans-serif;
	font-weight: 400;
}
</style>
